<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">

<ui:composition template="template.xhtml">
<style type="text/css">
    .noBorder tr,.noBorder td {
    border: none !important;
}
</style>
	<ui:define name="content">
		<h:form>
			<p:growl id="growl" showDetail="false" sticky="false" life="3000" />
			<p:panel header="Automatically send command to Arduino">
				<p:dataTable var="sensor" value="#{commandsBean.sensorsList}">
					<p:column headerText="SensorId" style="width:10%">
						<h:outputText value="#{sensor.sensorId}"></h:outputText>
					</p:column>
					<p:column headerText="Sensor value" style="width:15%">
						<p:selectOneRadio id="sensorValue" value="#{sensor.value}" styleClass="noBorder">
							<f:selectItem itemLabel="ON" itemValue="1"/>
							<f:selectItem itemLabel="OFF" itemValue="0"/>
						</p:selectOneRadio>
					</p:column>
					<p:column headerText="Timestamp" style="width:25%">
						<h:outputText value="#{sensor.timestamp}" />
					</p:column>
					<p:column headerText="Description" style="width:50%">
				<h:outputText value="#{sensor.description}" />	
			</p:column>
				</p:dataTable>
				<br />
				<p:commandButton value="Submit"
					actionListener="#{commandsBean.submit}" ajax="false" update="growl" />
			</p:panel>
			<p:panel header="Manualy send command to Arduino">
				<p:inputText value="#{commandsBean.commandToSend}" required="true" />
				<p:commandButton value="Send" actionListener="#{commandsBean.send}"
					ajax="false" update="growl" />
			</p:panel>
		</h:form>
	</ui:define>
</ui:composition>
</html>